Ext.define('Ext.ux.ImageAttachePanel', {
	extend : 'Ext.panel.Panel',
	xtype : 'imgage-attach',
	constructor : function(conf) {
		Ext.applyIf(this, conf);
		this.initUI();
		var def = {
			border : conf.border || false,
			width : '100%',
			autoHeight : true,
			minHeight : 100,
			style : 'padding: 5 5 15 15',
			tbar : [{
						xtype : 'button',
						iconCls : 'menu-attachment',
						scope : this,
						handler : this.addFile,
						text : '添加'
					}, {
						xtype : 'button',
						iconCls : 'reset',
						scope : this,
						text : conf.single ? '清除' : '清除所有',
						handler : this.clearFile
					}],
			items : [this.attachPanel]
		};
		if(!conf.single) {
			def.tbar.push({
						xtype : 'button',
						iconCls : 'reset',
						scope : this,
						text : '删除所选',
						handler : this.clearSelectedFiles
					});
		}
		this.callParent([def]);
	},
	initUI : function() {
		var me = this;
		var imgwh = this.imgwh || 'height=200';
		this.attachPanel = Ext.create('Ext.view.View', {
			store : new Ext.data.JsonStore({
						autoLoad : true,
						proxy : {
							type : 'ajax',
							url : __ctxPath
									+ '/system/loadByIdsFileAttach.do',
							reader : {
								rootProperty : 'fileAttachs'
							}
						},
						fields : ['fileId', 'fileName', 'filePath']
					}),
			tpl : [
					'<tpl for=".">',
					'<div class="thumb-wrap2" id="file_{fileId}">',
						'<div class="thumb">' +
						'	<img '+imgwh+' src="' + __ctxPath +'/attachFiles/{filePath}" title="{fileName:htmlEncode}">' +
						'</div>',
//						'<span class="x-editable">{fileName:htmlEncode}</span>',
					'</div>', 
					'</tpl>', 
					'<div class="x-clear"></div>'],
			height : this.height || 240,
			multiSelect: true,
			trackOver : true,
			overItemCls : 'x-item-over',
			itemSelector : 'div.thumb-wrap2',
			emptyText : this.emptyText || '请上传图片'
		});
	},
	// 添加附件
	addFile : function() {
		var me = this;
		var panel = this.attachPanel;
		var outerpanel = this;
		var scope = this.scope ? this.scope : this;
		var dialog = App.createUploadDialog2({
					file_cat : this.fileCat ? this.fileCat : '',
					permitted_extensions: this.permitted_extensions || [],
					scope : this.scope ? this.scope : this,
					is_history : true,
					callback : function(data) {
						var store = panel.getStore();
						for (var i = 0; i < data.length; i++) {
							var p = panel.getStore().getModel().create({
										fileId : data[i].fileId,
										fileName : data[i].fileName,
										filePath: data[i].filePath
									});
							p.commit();
							if(me.single) {
								store.removeAll();
							}
							store.insert(store.getCount(), p);
						}
						panel.refresh();
						outerpanel.doLayout();
					}
				});
		dialog.show();
	},
	/**
	 * 清除附件
	 */
	clearFile : function() {
		this.attachPanel.getStore().removeAll();
		this.attachPanel.refresh();
		this.fileIds = [];
		this.fileNames = [];
		this.doLayout();
	},
	// 清除所选
	clearSelectedFiles : function() {
		var store = this.attachPanel.getStore();
		var selRs = this.attachPanel.getSelectionModel().getSelection();
		for (var i = 0; i < selRs.length; i++) {
			store.remove(selRs[i]);
		}
		this.attachPanel.refresh();
		this.doLayout();
	},
	// 删除事件
	removeRs : function(record) {
		var store = this.attachPanel.getStore();
		store.remove(record);
		this.attachPanel.getView().refresh();
		this.doLayout();
	},
	// 行的Action
	deleteRs : function(grid, rowIndex, colIndex) {
		var record = grid.getStore().getAt(rowIndex);
		this.removeRs.call(this, record);

	},
	getFileIds : function() {
		var store = this.attachPanel.getStore();
		var fileIds = '';
		for (var i = 0; i < store.getCount(); i++) {
			var record = store.getAt(i);
			fileIds += record.get('fileId') + ',';
		}
		return fileIds;
	},
	getFileNames : function() {
		var store = this.attachPanel.getStore();
		var fileNames = '';
		for (var i = 0; i < store.getCount(); i++) {
			var record = store.getAt(i);
			fileNames += record.get('fileName') + ',';
		}
		return fileNames;
	},
	getAttachStore : function() {
		return this.attachPanel.getStore();
	},
	loadByResults : function(results) {
		this.attachPanel.getStore().loadData(results);
		this.attachPanel.getView().refresh();
		this.doLayout();
	},
	loadByIds : function(ids) {
		this.attachPanel.getStore().load({
					params : {
						ids : ids
					},
					callback : function() {
						this.doLayout();
					},
					scope : this
				});
	}
});
